Conditions | 1 |
Paths | 4 |
Total Lines | 80 |
Lines | 80 |
Ratio | 100 % |
Changes | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
1 | View Code Duplication | define(function(require) { |
|
|
|||
2 | 'use strict'; |
||
3 | |||
4 | var ContentVariantCollectionComponent; |
||
5 | var _ = require('underscore'); |
||
6 | var $ = require('jquery'); |
||
7 | var mediator = require('oroui/js/mediator'); |
||
8 | var BaseComponent = require('oroui/js/app/components/base/component'); |
||
9 | |||
10 | ContentVariantCollectionComponent = BaseComponent.extend({ |
||
11 | options: { |
||
12 | buttonSelector: '[data-role="variant-button"]', |
||
13 | variantRemoveSelector: '[data-action="remove"]', |
||
14 | collectionContainerSelector: '[data-role="collection-container"]' |
||
15 | }, |
||
16 | |||
17 | /** |
||
18 | * @inheritDoc |
||
19 | */ |
||
20 | constructor: function ContentVariantCollectionComponent() { |
||
21 | ContentVariantCollectionComponent.__super__.constructor.apply(this, arguments); |
||
22 | }, |
||
23 | |||
24 | /** |
||
25 | * @inheritDoc |
||
26 | */ |
||
27 | initialize: function(options) { |
||
28 | this.options = _.defaults(options || {}, this.options); |
||
29 | |||
30 | this.$el = this.options._sourceElement; |
||
31 | |||
32 | this.$el.on('click', this.options.buttonSelector, _.bind(this.onAdd, this)); |
||
33 | this.$el.on('click', this.options.variantRemoveSelector, _.bind(this.onRemove, this)); |
||
34 | this.prototypeName = this.$el.data('prototype-name') || '__name__'; |
||
35 | this.$collectionContainer = this.$el.find(this.options.collectionContainerSelector); |
||
36 | }, |
||
37 | |||
38 | onAdd: function(e) { |
||
39 | e.preventDefault(); |
||
40 | |||
41 | var $button = $(e.currentTarget); |
||
42 | if ($button.attr('disabled')) { |
||
43 | return; |
||
44 | } |
||
45 | |||
46 | var prototype = this.$el.data('prototype'); |
||
47 | if (prototype) { |
||
48 | var index = parseInt(this.$el.data('last-index')); |
||
49 | var nextItemHtml = prototype.replace(new RegExp(this.prototypeName, 'g'), index); |
||
50 | |||
51 | this.$collectionContainer |
||
52 | .prepend(nextItemHtml) |
||
53 | .trigger('content:changed'); |
||
54 | this.$el.data('last-index', ++index); |
||
55 | |||
56 | this.validateContainer(); |
||
57 | } |
||
58 | |||
59 | mediator.trigger('cms:content-variant-collection:add', this.$el); |
||
60 | }, |
||
61 | |||
62 | onRemove: function(e) { |
||
63 | e.preventDefault(); |
||
64 | var item = $(e.target).closest('*[data-content]'); |
||
65 | item.remove(); |
||
66 | |||
67 | mediator.trigger('cms:content-variant-collection:remove', this.$el); |
||
68 | }, |
||
69 | |||
70 | validateContainer: function() { |
||
71 | var $validationField = this.$el.find('[data-name="collection-validation"]:first'); |
||
72 | var $form = $validationField.closest('form'); |
||
73 | if ($form.data('validator')) { |
||
74 | $form.validate().element($validationField.get(0)); |
||
75 | } |
||
76 | } |
||
77 | }); |
||
78 | |||
79 | return ContentVariantCollectionComponent; |
||
80 | }); |
||
81 |